<template>
 <div class="home">
    <vueHead></vueHead>
    <md-tabs md-fixed>
      <md-tab id="movies" md-label="推荐">
        <vueList></vueList>
      </md-tab>

      <md-tab id="music" md-label="热门">
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt dolorum quas amet cum vitae, omnis! Illum quas voluptatem, expedita iste, dicta ipsum ea veniam dolore in, quod saepe reiciendis nihil.</p>
      </md-tab>

      <md-tab id="updata" md-label="最近更新">
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt dolorum quas amet cum vitae, omnis! Illum quas voluptatem, expedita iste, dicta ipsum ea veniam dolore in, quod saepe reiciendis nihil.</p>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt dolorum quas amet cum vitae, omnis! Illum quas voluptatem, expedita iste, dicta ipsum ea veniam dolore in, quod saepe reiciendis nihil.</p>
      </md-tab>
    </md-tabs>

    <vueSiderbar></vueSiderbar>
    <vueBottom></vueBottom>
 </div>
</template>

<script type="text/ecmascript-6">
import vueHead from '../components/headbar'
import vueBottom from '../components/bottom'
import vueList from '../components/list'
import vueSiderbar from '../components/siderbar'
export default {
  data () {
    return {}
  },
  components: {
    vueHead,
    vueBottom,
    vueList,
    vueSiderbar
  }
}
</script>

<style scoped>
.md-tabs {
  margin-top: 2px;
}
</style>
